<template>
  <div>
    <form>
      <label>姓名：</label>
      <input type="text" v-model="name" /><br /><br />

      <label>年龄：</label>
      <input type="number" v-model="age" /><br /><br />

      <label>身高：</label>
      <input type="number" v-model="height" />(厘米)<br /><br />

      <label>体重：</label>
      <input type="number" v-model="weight" />(公斤)<br /><br />

      <label>病史：</label>
      <input type="text" v-model="medical" /><br /><br />

      <button @click.prevent="fn" >诊断</button>
    </form>

    <p>患者{{ name }} 的诊断结果： {{ diagnosis }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      name: "",
      age: "",
      height: "",
      weight: "",
      medical: "",
      diagnosis: " ",
      bmi: "",
    };
  },
  methods: {
    fn() {
      this.bmi = this.weight / ((this.height/ 100)  * (this.height/ 100 ));
      console.log(this.bmi);
      if (this.bmi < 18.5) {
        this.diagnosis = "体重过轻";
      } else if (this.bmi >= 18.5 && this.bmi < 24.9) {
        this.diagnosis = "正常";
      } else if (this.bmi > 24.9 && this.bmi < 29.9) {
        this.diagnosis = "体重过重";
      } else {
        this.diagnosis = "肥胖";
      }
    },
  },
};
</script>
